Css Sprite nedir?
Css sprite, sitede kullanılan tüm ikon görsellerinin tek kodla yazılmasıdır. Her ikon için ayrı ayrı kod yazmak yerine bütün ikonları tek bir görselde birleştirip tek bir kod yazılarak uygulanan bir tekniktir.
Css sprite, sitede kullanılan tüm ikon görsellerinin tek kodla yazılmasıdır. Her ikon için ayrı ayrı kod yazmak yerine bütün ikonları tek bir görselde birleştirip tek bir kod yazılarak uygulanan bir tekniktir.
Css sprite tekniğinin asıl amacı, ana sayfanızda bulunan resimlerin tek bir dosya içerisinden hızlı bir şekilde çağrılmasıdır. Wordpress'de bu tekniği bir takım eklentiler sayesinde sitenize uygulayabilirsiniz.
Google Seo için önemi ise kod tasarrufundan kaynaklanmaktadır. Bu teknik sayesinde kullanılan kod sayısı azalmakta ve siteler hızlı açılmaktadır.
Arama motorları mini görselleri tek tek görmek yerine tek bir görselde görmek istiyor.
Css Sprite nasıl yapılır?
http://www.spritecow.com/ bu siteden kolayca yapılabilir.
Sitede sabit olarak var olan tüm görselleri arkası temiz olarak Photoshop'ta tek bir sayfada birleştirdim.
Png olarak kaydettim.
http://www.spritecow.com/
Open dan ilgili görseli seçin
Aşağıda kod görülecektir.
.sprite {
background: url('imgs/1.png') no-repeat -617px -516px;
width: 150px;
height: 150px;
}
